<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>浮动布局和float属性</title>
<style type="text/css">
.box1 {
	height: 50px;
	background: red;
	float: left;
}

.box2 {
	height: 50px;
	background: blue;
	float: right;
}
</style>
</head>
<!--如果box1没有内容 知己设置 float属性 将导致box1缩成一个原点, 如果设置了浮动 ，紧挨着右边滴元素会受到影响 -->
<body>
	<p>如果box1没有内容 知己设置 fl</p>
	<div class="box1">呵呵哈哈哈或</div>
	<div class="box2">果box1没有内容 知己设置 f如果box1没有内容 知</div>

	<p>如果box1没有内容 知己设置 fl如果box1没有内容 知己设置 f如果box1没有内容 知己设置 f如果box1没有内容
		知己设置 f</p>

</body>
</html>